<!DOCTYPE html>
<html>
    <head>
        <title>Book Share (Roberto Code Name Version 0.1)</title>
        <meta charset="utf-8">
        <link rel="stylesheet" media="screen" href="@{'/public/stylesheets/bootstrap.css'}">
        <link rel="shortcut icon" type="image/png" href="@{'/public/images/favicon.png'}">
    </head> 

    <body> 
        <div class="navbar navbar-fixed-top pull-left">
            <div class="navbar-inner">
                <div class="container">
                    <a class="brand" href="#">Book Share</a>
                    <ul class="nav">
                        <li><a href="#">Acerca</a></li>
                        <li><a href="#contact">Contacto</a></li>
                    </ul>
                    <!-- Div para Login -->
                    <ul class="nav pull-right">

                        <li class="dropdown" id="menu1">
                            <a class="dropdown-toggle" data-toggle="dropdown" href="#menu1">
                                Login
                                <b class="caret"></b>
                            </a>
                            <div class="dropdown-menu">
                                #{form @authenticate()}
                                #{if flash.error}
                                <div class="alert alert-error" style="margin-left: 8px; margin-right: 8px; margin-top: 8px;">
                                    <button type="button" class="close" data-dismiss="alert">×</button>
                                    Error al Iniciar Sesión.
                                </div>
                                #{/if}
                                <div style="margin-left: 8px; margin-right: 8px">
                                    <input style="margin-top: 8px" type="text" name="username" id="username" placeholder="Usuario"  value="${flash.username}" />
                                    <input style="margin-top: 8px" type="password" name="password" id="password" placeholder="Contraseña" value="" />
                                    <input class="btn-success" type="submit" id="signin" value="&{'secure.signin'}" />
                                </div>
                                #{/form}
                            </div>
                        </li>
                    </ul>

                    <!-- Fin login -->

                </div>
            </div>
        </div>
        <br>
        <div>
            <iframe src="/admin/usuarios/new" height="600" width="600" style="float: right;">
            </iframe>
        </div>

        <script language="javascript">
            
            $('.dropdown-toggle').dropdown();
            $('.dropdown-menu').find('form').click(function (e) {
                e.stopPropagation();
            });
        </script>
        <script src="@{'/public/javascripts/jquery-1.8.2.min.js'}" type="text/javascript"></script>
        <script src="@{'/public/javascripts/bootstrap.js'}" type="text/javascript"></script>
    </body>

</html>